<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>WebSocket测试</title>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
    <div id="sse1">
        <a href="javascript:wsTest()">进入聊天室</a>
    </div>
    <div id="sse2">
        <a href="javascript:ws.send('hi 大家好！有人在吗?')">打招呼</a>
    </div>
    <div id="sse3">
        <a href="javascript:ws.close()">退出聊天室</a>
    </div>
    <div id="content"></div>
</body>
<script type="text/javascript">
    var username = "sunxuewu";//用户姓名
    var ws;//建立的连接

    function wsTest()
    {
        if ("WebSocket" in window){
            alert("您的浏览器支持 WebSocket!");
            ws = new WebSocket("ws://localhost:18092/websocket/test/one/" + username);// 打开一个 web socket
            ws.onopen = function(){
                // $("#content").append("" + username + "发送数据</p>");
            };
            ws.onmessage = function (evt){
                $("#content").append("<p>接收数据：" + evt.data +"</p>");
            };
            ws.onclose = function(){
                $("#content").append("<p>" + username + "退出聊天室</p>");
            };
            ws.onerror = function(){
                $("#content").append("<p>" + username + "连接发生错误</p>");
            };
        } else {
            alert("您的浏览器不支持 WebSocket!");
        }
    }
</script>
</html>